<!DOCTYPE html>
<html lang="en">

<head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>todoList</title>
   <link rel="stylesheet" href="./index.css">
</head>

<body>
   <div id="root">
      <div class="todo-container">
         <div class="todoheader">
            <input type="text" placeholder="请输入内容，按回车键确认">
         </div>
         <ul class="todo-main">
            <li>
               <label>
                  <input type="checkbox">
                  <span>xxxx</span>
                  <button class="btn" style="display: none;">删除</button>
               </label>
            </li>
            <li>
               <label>
                  <input type="checkbox">
                  <span>xxxx</span>
                  <button class="btn" style="display: none;">删除</button>
               </label>
            </li>
         </ul>
         <div class="todo-footer">
            <label>
               <input type="checkbox" />
            </label>
            <span>
               <span>已完成0</span> / 全部2
            </span>
            <button class="btn">清除已完成任务</button>
         </div>
      </div>
   </div>
</body>

</html>